<template>
  <el-container>
    <div style="padding: 10px;padding-bottom: 0">
      <div class="report_header" ref="headerHeight">
        <div style="display: flex;align-items: center">
          <div class="report_header_left"></div>
          <div style="width: 800px;display: flex;align-items: center;">
            <div class="report_header_date" v-if="datashow==true">
              <el-date-picker
                style="width: 100%"
                v-model="query.date"
                value-format="yyyy-MM-dd"
                type="daterange"
                align="right"
                unlink-panels
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :picker-options="pickerOptions">
              </el-date-picker>
            </div>

           <div class="report_header_date">
            <el-select v-model="productName" clearable placeholder="请选择商品"
                       filterable @focus="getProductList" value-key="id" :filter-method="queryProduct"
                       @change="changeProduct" style="width: 100%">
              <el-option v-for="item in productOptions" :key="item.id" :label="item.name" style="width:650px"
                         :value="item">
                <div style="display: flex">
                  <span style="width: 80px;overflow: hidden;text-overflow: ellipsis;">{{ item.sn }}</span>
                  <span style="float: left;width: 160px;overflow: hidden;text-overflow: ellipsis;margin-left: 10px">{{item.name }}</span>
                  <div style="width: 200px;">
                    <span style="color: #8492a6; font-size: 8px;">{{ item.spec1 }}</span>
                  </div>
                </div>
              </el-option>
              <div style="display: flex;width: 100%;position: absolute;bottom: 0">
                <div style="width: 50%;background-color: rgb(248,248,248);"></div>
                <div class="elOption" @click="toAddProduct">搜索商品</div>
              </div>
              <div style="height: 30px"></div>
            </el-select>
          </div>
          <div class="report_header_query">
            <el-select value-key="id" :filter-method="loadShop" clearable style="width: 100%;" v-model="query.shopId" filterable placeholder="请选择仓库">
              <el-option
                v-for="item in shopList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
          </div>
          </div>
          <div style="display: flex;flex-direction: row;justify-content: flex-end;width: 100%;">
            <div
              style="display: flex;flex-direction: row;flex-wrap: wrap;overflow: hidden;height:41px;justify-content: flex-end;">
            </div>

              <el-button style="margin-top: 7px;height: 100%" type="primary" size="small" @click="queryClick">查询
              </el-button>

            <el-button style="margin-left: 10px;margin-top: 7px;height: 100%" size="small" type="primary"
                       @click="depositClick(3)">入库登记
            </el-button>
            <el-button style="margin-left: 10px;margin-top: 7px;height: 100%" size="small" type="primary"
                       @click="depositClick(2)">出库登记
            </el-button>
            <el-button style="margin-left: 10px;margin-top: 7px;height: 100%" size="small" type="primary"
                       @click="allocationfun">调拨出库
            </el-button>

            <ExportList2Excel style='margin-left: 10px;margin-top: 5px;' ref="exportList2Excel" @handleExport="handleExport" name="导出" />

          </div>
        </div>

      </div>
    </div>
    <div class="pd10">

      <shiping shippingType="已配送" :audited="audited" :shippingForm="shippingForm" type="1" @detailsClick="detailsClick"></shiping>
    </div>
    <el-footer class="el-footerBox">
      <pagination :total="total" :page.sync="pageNum" :limit.sync="pageSize"
                  @pagination="loadSummary" style="margin-bottom: auto"></pagination>
    </el-footer>
    <upload-excel-component ref="upload" :on-success="handleSuccess" :before-upload="beforeUpload"/>
    <el-dialog :title="emptyBarrelTitle=='修改并审核'?'修改并审核':`${emptyBarrelTitle}登记`" :visible.sync="emptyBarrelDialogVisible" v-if="emptyBarrelDialogVisible" width="500px" @close="depositClose">
      <el-form ref="emptyBarrelRef" :rules="emptyBarrelRules"  :model="emptyBarrelForm" label-width="80px">
        <el-form-item label="发货仓库"  >
          <el-select value-key="id" :filter-method="loadShop" style="width: 80%;" :disabled="emptyBarrelTitle=='修改并审核'?true:false" v-model="emptyBarrelForm.shopId" filterable placeholder="请选择">
            <el-option
              v-for="item in shopList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="商品名称" >
          <search-options :tips-text="'请选择商品名称'" :disabled="emptyBarrelTitle=='修改并审核'?true:false" :options-style="'width: 80%'" :request="'product'" :fixed-params="productParams" @getAllData="getProduct" />
        </el-form-item>
        <el-form-item :label="emptyBarrelTitle=='修改并审核'?'数量':`${emptyBarrelTitle}数量`" prop="quantity">
          <el-input v-model="emptyBarrelForm.quantity" style="width: 80%" type="Number" clearable />
        </el-form-item>
        <el-form-item label="备注" prop="memo">
          <el-input v-model="emptyBarrelForm.memo" :disabled="emptyBarrelTitle=='修改并审核'?true:false" style="width: 80%" clearable />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="emptyBarrelDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="emptyBarrelClick('emptyBarrelRef')">{{emptyBarrelTitle=='修改并审核'?'审 核':'确 定'}}</el-button>
      </div>
    </el-dialog>
    <el-dialog
      title="导入"
      :visible.sync="daoruType"
      width="20%"
      v-el-drag-dialog
      append-to-body
      :before-close="daoruClose">
      <div
        style="position: relative;height: 10vh;overflow: auto;display: flex;flex-direction: column;align-items: center">
        <span>{{ firstSheetName }}</span>
        <span>共计{{ daoruData.length }}条数据</span>
        <el-button type="info" style="margin-top: 20px" @click="batchShippingClick">确认导入</el-button>
      </div>
    </el-dialog>
    <el-dialog
      title="双击选择客户"
      :visible.sync="memberTableVisible"
      width="950px"
      v-el-drag-dialog
      append-to-body
      :before-close="memberTableClose">
      <div style="position: relative;">
        <member-table :key="times" @memberDouble="memberDouble" @memberTableClose="memberTableClose"></member-table>
      </div>
    </el-dialog>
    <el-dialog
      title="查找商品"
      :visible.sync="orderVisible"
      width="950px"
      v-el-drag-dialog
      :before-close="orderClose">
      <div style="position: relative;">
        <productTable ref="productList" @doubleClick="doubleClick" @addClick="addProductClick"></productTable>
      </div>
    </el-dialog>
    <el-dialog
      title="查找供应商"
      :visible.sync="supplierVisible"
      width="950px"
      v-el-drag-dialog
      append-to-body
      :before-close="supplierClose">
      <div style="position: relative;height: 63vh;overflow: auto">
        <supplierTable :key="times" @doubleSupplier="doubleSupplier"></supplierTable>
      </div>
    </el-dialog>
     <el-dialog
      title="调拨出库"
      :visible.sync="allocation"
      width="950px"
      v-el-drag-dialog
      append-to-body>
      <div>
       <el-form ref="allocationlist" :rules="allRules"  :model="allocationlist" label-width="80px">
        <el-form-item label="调出仓库"  prop="outShopId">
          <el-select value-key="id" clearable  :filter-method="loadShop" style="width: 50%;"  v-model="allocationlist.outShopId" filterable placeholder="请选择" >
            <el-option
              v-for="item in shopList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="空桶名称" prop="allocationproductId">
            <el-select value-key="id" style="width: 50%;"  v-model="allocationlist.allocationproductId" filterable placeholder="请选择">
            <el-option  v-for="item in emptybarreList" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
        </el-form-item>
          <el-form-item label="调入仓库"   prop="intoShopId" >
          <el-select value-key="id" :filter-method="loadShop" style="width: 50%;"  v-model="allocationlist.intoShopId" filterable placeholder="请选择">
            <el-option
              v-for="item in shopList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="数量" prop="number">
          <el-input v-model="allocationlist.number" style="width: 50%" type="Number" clearable />
        </el-form-item>
        <el-form-item>
        <el-button type="primary" @click="allocationclick('allocationlist')" :loading='allocationloading'>完成</el-button>
        </el-form-item>
      </el-form>
      </div>
    </el-dialog>
  </el-container>
</template>
<script>
  import searchOptions from '@/components/searchOptions'
  import { list as supplierList } from '@/api/supplier'
  import permission from '@/directive/permission/index.js' // 权限判断指令
  import memberTable from '@/components/MemberTable/index'
  import productTable from '@/components/ProductList/productList'
  import supplierTable from '../../components/SupplierTable/supplierList'
  import loadMore from '@/utils/more.js'
  import { EventBus } from '@/api/eventBus'
  import shippingList from './components/list'
  import shiping from './components/shiping'
  import { exportList, batchShipping } from '@/api/shipping'
  import {emptyBarrel,audited,summaryList,addEmptyBarrel,decEmptyBarrel,decStock,addStock,allocationagen} from '@/api/emptyBarrel'
  import { list as memberList } from '@/api/member'
  import Pagination from '@/components/Pagination'
  import utils from '../../utils/utils.js'
  import UploadExcelComponent from '@/components/UploadExcel/index.vue'
  import ExportList2Excel from '@/components/ExportList2Excel'
  import elDragDialog from '@/directive/el-drag-dialog' // base on element-ui
  import { list as productList } from '@/api/product'
  import { list as emoloyeeList } from '@/api/sysEmployee'
  import { getInfo, list as sysMchList } from '@/api/sysMch'
  import {list as shopList} from "@/api/shop";

  export default {
    name: 'emptyBarrelAudit-list',
    directives: { elDragDialog, loadMore, permission },
    activated() {
      this.payLoads = new Date().getTime()
    },
    data() {
      return {
        allocationloading:false,
        emptybarreList:[], //空桶列表
        allocationlist:{
        intoShopId:'',
        number:"",
        outShopId:'',
        allocationproductId:''
        },
        allocation:false,
        productParams: {
          'subType': 4,
          'type': 0,
          'isList': true
        },
        emptyBarrelRules: {
          name: [
            { required: true, message: '请选择商品名称', trigger: 'blur' }
          ],
          quantity: [
            { required: true, message: '请输入数量', trigger: 'blur' }
          ],
          memo: [
            { required: true, message: '请输入备注', trigger: 'blur' }
          ]
        },
        allRules: {
          allocationproductId: [
            { required: true, message: '请选择商品', trigger: 'blur' }
          ],
          intoShopId: [
            { required: true, message: '请选择仓库', trigger: 'blur' }
          ],
          outShopId: [
            { required: true, message: '请选择仓库', trigger: 'blur' }
          ],
         number:[{
               required: true, message: '请输入数量', trigger: 'blur'
         }]
        },
        datashow:"",
        productName: '',
        suppliers: [],
        emptyBarrelForm:{},
        supplierName: '',
        emptyBarrelTitle:'',
        payLoads: '',
        shopList:[],
        emptyBarrelDialogVisible:false,
        audited:1,
        orderVisible: false,
        memberName: '',
        shippingStatus: 2,
        visible: false,
        shippingForm: [],
        pageNum: 1,
        pageSize: 20,
        printing:5000,
        total: 0,
        memberTableVisible: false,
        members: [],
        supplierVisible: false,
        times: '',
        emoloyee: [],
        curHeight: null,
        tabsHeight: null,
        mchIdOptions: [],
        mchType: '',
        queryType: false,
        query: {
          date: [],
          sn: '',
          shopId:'',
          memberId: '',
          orderSn: '',
          phone: '',
          productId: '',
          supplierId: '',
          emoloyeeId: ''
        },
        keyword: {
          date: [],
          shopId:'',
          sn: '',
          memberId: '',
          orderSn: '',
          phone: '',
          productId: '',
          supplierId: '',
          emoloyeeId: ''
        },
        pickerOptions: {//时间快捷选择
          shortcuts: [{
            text: '昨天',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24)
              picker.$emit('pick', [start, end])
            }
          }, {
            text: '最近一周',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', [start, end])
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
              picker.$emit('pick', [start, end])
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
              picker.$emit('pick', [start, end])
            }
          }]
        },
        daoruType: false,
        daoruData: [],
        productOptions: [],
        firstSheetName: '',
        shops:[]      }
    },
    components: {
      shiping,shippingList, Pagination, UploadExcelComponent, ExportList2Excel, memberTable, productTable, supplierTable,searchOptions
    },
    created() {
      var _this = this
      this.loadShop('')
      // this.loadOrder()
      this.loadSummary()
      this.loadSupplier('')
      EventBus.$on('warehouse-add', res => { // 监听新增完毕
        // 更新列表数组
        _this.shippingForm.splice(0, 0, res)
      })
      EventBus.$on('shipping-employeeAdd', res => {
        // this.loadOrder()
         this.loadSummary()
      })
      EventBus.$on('warehouse-view', res => { // 监听新增完毕
        // 更新列表数组
        for (var i = 0; i < _this.shippingForm.length; i++) {
          if (_this.shippingForm[i].id == res.id) {
            this.$set(this.shippingForm, i, res)
          }
        }
      })
      EventBus.$on('shipping-view', res => { // 监听新增完毕
        // 更新列表数组
        for (var i = 0; i < _this.shippingForm.length; i++) {
          if (_this.shippingForm[i].id == res.id) {
            this.$set(this.shippingForm, i, res)
          }
        }
      })
    },
    mounted() {

      this.comeIn()
      this.beforeMount()
    },
    methods: {
      handleExport() {
        let _this = this
        var loading = this.$loading({
          lock: true,
          text: 'Loading',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
        let data = {}
        data.tHeader = ["仓库名称","货号", "商品名称","单位",'当前库存','入库数量','出库数量','回桶数量']
        data.filterVal = ["shopName","sn","name","unit",'quantity','inQuantity','outQuantity','backQuantity']
        data.filename = "应付款汇总表";

        let params = new URLSearchParams()
        params.append('productId', this.keyword.productId)
        params.append('pageSize', this.printing)
        params.append('pageNum', this.pageNum)
        params.append('shopId',this.keyword.shopId)
        summaryList(params).then(res=>{
          data.list = res.data.data
          _this.$refs.exportList2Excel.handleDownload(data);
          loading.close();

          if(data.list.length==this.printing){
            this.pageNum++
            console.log(this.pageNum);
            this.handleExport()
          }
          else{
            return;
          }
        }).catch(error => {
          _this.$refs.exportList2Excel.unlockLoading()
          loading.close();
          console.log('error!!')
        })
      },
      productListchange(){
         let params = new URLSearchParams()
        params.append('subType',4)
        params.append('type', 0)
        params.append('isList',true)
        productList(params).then(res=>{
          this.emptybarreList=res.data.data
        })

      },
      allocationclick(allocationlist){
        this.$refs[allocationlist].validate((valid) => {
        if(valid){
          this.allocationloading=true
        this.allocationlist.number=Number(this.allocationlist.number)
        let params = new URLSearchParams()
        params.append('number',this.allocationlist.number)
        params.append('outShopId',this.allocationlist.outShopId)
        params.append('productId',this.allocationlist.allocationproductId)
        params.append('intoShopId',this.allocationlist.intoShopId)
        allocationagen(params).then(res=>{
          if(res.type=='success'){
            this.allocationloading=false
            this.allocation=false
            this.$message({ showClose: true,  message: '调拨成功', type: 'success'});
          }

        }).catch(res=>{
           this.allocationloading=false
           this.allocation=false

        })
      }
      })},
      allocationfun(){
        this.allocation=true
        //console.log('78787788');
        this.allocationlist.number=null
        this.allocationlist.outShopId=null
        this.allocationlist.allocationproductId=null
        this.allocationlist.intoShopId=null
        this.productListchange()
        //console.log(this.allocationlist.allocationproductId);
      },
      getProduct(value){
        if (!utils.isNull(value)) {

          // this.emptyBarrelForm.adminFreight = 0
          this.emptyBarrelForm.cost = 0
          this.emptyBarrelForm.audited=1
          this.emptyBarrelForm.name = value.name
          this.emptyBarrelForm.productId = value.id
          // this.emptyBarrelForm.shippingFreight = 0
          this.emptyBarrelForm.sn = value.sn
          this.emptyBarrelForm.spec = value.spec1
          this.emptyBarrelForm.thumbnail = value.thumbnail
          this.emptyBarrelForm.unit = value.unit
        } else {
          // this.emptyBarrelForm.adminFreight = null
          this.emptyBarrelForm.cost = null
          this.emptyBarrelForm.name = null
          this.emptyBarrelForm.audited=1
          this.emptyBarrelForm.productId = null
          // this.emptyBarrelForm.shippingFreight = null
          this.emptyBarrelForm.sn = null
          this.emptyBarrelForm.spec = null
          this.emptyBarrelForm.thumbnail = null
          this.emptyBarrelForm.unit = null
        }
      },
      loadShop(query) {
        let params = new URLSearchParams()
        params.append('pageSize',100)
        params.append('name', query)
        shopList(params).then(res => {
          this.shopList = res.data.data
        })
      },
      depositClick(data){
        if (data==0){
          this.emptyBarrelTitle='存桶'
          this.emptyBarrelForm = {}
           this.emptyBarrelForm.name=''
        }else if(data==1){
          this.emptyBarrelTitle='欠桶'
          this.emptyBarrelForm = {}
            this.emptyBarrelForm.name=''
        }else if(data==2){
          this.emptyBarrelTitle='出库'
          this.emptyBarrelForm = {}
            this.emptyBarrelForm.name=''
        }else if(data==3){
          this.emptyBarrelTitle='入库'
          this.emptyBarrelForm = {}
            this.emptyBarrelForm.name=''
        }else if (data == 4){
          this.emptyBarrelTitle='修改并审核'
        }
        this.emptyBarrelDialogVisible=true
      },
      emptyBarrelClick(formName) {
        var _this = this
        this.$refs[formName].validate((valid) => {
          if (valid) {
            const obj = {}
            console.log(this.emptyBarrelForm)
            for (const key in this.emptyBarrelForm) {
              obj[key] = this.emptyBarrelForm[key]
            }
            const tempFrom = [obj]

            if (this.emptyBarrelTitle === '欠桶') {
              tempFrom[0].quantity = -Math.abs(tempFrom[0].quantity) // 全部转成负数避免用户输入错误
              console.log(tempFrom);
              decEmptyBarrel(tempFrom,{shopId:this.emptyBarrelForm.shopId}).then(res => {
                _this.emptyBarrelDialogVisible = false
                if (_this.audited==0){
                  _this.loadOrder()
                }else{
                  _this.loadSummary()
                }
              }).catch(err => { console.log(err) })
            } else if (this.emptyBarrelTitle === '存桶') {
              tempFrom[0].quantity = Math.abs(tempFrom[0].quantity)
              addEmptyBarrel(tempFrom,{shopId:this.emptyBarrelForm.shopId}).then(res => {
                _this.emptyBarrelDialogVisible = false
                if (_this.audited==0){
                  _this.loadOrder()
                }else{
                  _this.loadSummary()
                }
              }).catch(err => { console.log(err) })
            }else if (this.emptyBarrelTitle === '出库'){
              tempFrom[0].quantity = Math.abs(tempFrom[0].quantity)
              decStock(tempFrom,{shopId:this.emptyBarrelForm.shopId}).then(res => {
                _this.emptyBarrelDialogVisible = false
                if (_this.audited==0){
                  _this.loadOrder()
                }else{
                  _this.loadSummary()
                }
              }).catch(err => { console.log(err) })
            }else if (this.emptyBarrelTitle === '入库'){
              tempFrom[0].quantity = Math.abs(tempFrom[0].quantity)
              addStock(tempFrom,{shopId:this.emptyBarrelForm.shopId}).then(res => {
                _this.emptyBarrelDialogVisible = false
                if (_this.audited==0){
                  _this.loadOrder()
                }else{
                  _this.loadSummary()
                }
              }).catch(err => { console.log(err) })
            }else if (this.emptyBarrelTitle == '修改并审核'){
              var array=[]
              var params=new URLSearchParams()
              params.append('shopId',this.emptyBarrelForm.shopId)
              _this.emptyBarrelForm.audited = 1
              array.push(_this.emptyBarrelForm)
              audited(array,params).then(res=>{
                if(res.type=='success'){
                  this.loadOrder()
                }
              })
            }
          }
        })
      },
      depositClose(){
        this.emptyBarrelDialogVisible=false
      },
      loadSysmch(query) {
        sysMchList({ name: query }).then(res => {
          this.mchIdOptions = res.data.data.filter(val => {
            return val.mchType === 3 || val.mchType === 1
          })
        }).catch(err => {
          console.log(err)
        })
      },
      changeSysMch() {
        this.loadOrder()
      },
      // querySysmch(query) {
      //   this.loadSysmch(query)
      // },
      loadMch() {
        getInfo().then(res => {
          this.mchType = res.data.mchType
        })
      },
      memberDouble(data) {
        this.memberName = data.name
        this.query.memberId = data.id
        this.memberTableVisible = false
      },
      memberTableClose() {
        this.memberTableVisible = false
      },
      doubleSupplier(data) {
        this.supplierName = data.name
        this.query.supplierId = data.id
        this.supplierVisible = false
      },
      supplierClose() {
        this.supplierVisible = false
      },
      addProductClick(data) {
        if (data.length > 1) {
          this.productName = data[0].name
          this.query.productId = data[0].id
          this.orderVisible = false
          this.$message({
            message: '只能查询一个商品',
            offset: 120,
            center: true
          })
        } else {
          this.productName = data[0].name
          this.query.productId = data[0].id
        }
      },
      doubleClick(val) {
        this.productName = val.name
        this.query.productId = val.id
        this.orderVisible = false
      },
      orderClose() {
        this.orderVisible = false

      },
      toSearchMember() {
        this.times = new Date().getSeconds()
        this.memberTableVisible = true
      },
      selectMember(data) {
        if (!utils.isNull(data)){
          this.memberName = data.name
          this.query.memberId = data.id
        }else {
          this.query.memberId = ''
        }

      },
      toAddProduct() {
        this.orderVisible = true
      },
      changeProduct(data) {
        if (!utils.isNull(data)){
          this.productName = data.name
          this.query.productId = data.id
        }else {
          this.query.productId = ''
        }

      },
      toSearchSupplier() {
        this.times = new Date().getSeconds()
        this.supplierVisible = true
      },
      changeSupp(val) {
        if (!utils.isNull(val)){
          this.supplierName = val.name
          this.query.supplierId = val.id
        }else {
          this.query.supplierId =''
        }

      },
      sendClick() {
        this.$router.push({
          path: '/emptyBarrelAudit/batchShipping'
        })
      },
      importClick() {
        this.$router.push({
          path: '/emptyBarrelAudit/import'
        })
      },
      queryMember(query) {
        this.getMemberList(query)
      },
      getMemberList(query) {
        let param = new URLSearchParams()
        param.append('keyword', query)
        memberList(param).then(res => {
          this.members = res.data.data
        })
      },

      queryEmployee(query) {
        this.getEmployeeList(query)
      },
      getEmployeeList(query) {
        let param = new URLSearchParams()
        param.append('name', query)
        emoloyeeList(param).then(res => {
          console.log(res)
          console.log('送货员')
          this.emoloyee = res.data.data
        })
      },

      remoteMethod(query) {
        this.loadSupplier(query)
      },
      beforeMount() {
        var _this = this
        window.onresize = () => {
          return (() => {
            if (_this.queryType == true) {
              var h = document.documentElement.clientHeight || document.body.clientHeight
              this.curHeight = h - 311//减去页面上固定高度height
              this.tabsHeight = h - 381
            } else {
              var h = document.documentElement.clientHeight || document.body.clientHeight
              _this.curHeight = h - 224//减去页面上固定高度height
              this.tabsHeight = h - 294
            }
          })()
        }
      },
      comeIn() {
        console.log('222')
        var h = document.documentElement.clientHeight || document.body.clientHeight
        this.curHeight = h - 224//减去页面上固定高度height
        this.tabsHeight = h - 294
      },
      loadSummary(){
        let params = new URLSearchParams()
        params.append('productId', this.keyword.productId)
        params.append('pageNum', this.pageNum)
        params.append('pageSize', this.pageSize)
        params.append('shopId',this.keyword.shopId)
        summaryList(params).then(res=>{
          this.shippingForm = res.data.data
          this.total = res.data.total
        })
      },
      chooseClick() {
        this.queryType = !this.queryType
        if (this.queryType == true) {
          var h = document.documentElement.clientHeight || document.body.clientHeight
          this.curHeight = h - 265//减去页面上固定高度height
          this.tabsHeight = h - 334
        } else {
          var h = document.documentElement.clientHeight || document.body.clientHeight
          this.curHeight = h - 224//减去页面上固定高度height
          this.tabsHeight = h - 294
        }
      },
      queryProduct(query) { // 查询商品
        this.productOptions = []
        productList({ name: query }).then(res => {
          res.data.data.forEach((option, index) => {

            this.$set(this.productOptions, index, option)
          })
        }).catch(err => {
          console.log(err)
        })
      },
      getProductList() { // 加载商品
        productList().then(res => {
          res.data.data.forEach((option, index) => {

            this.$set(this.productOptions, index, option)
          })
        }).catch(err => {
          console.log(err)
        })
      },
      loadSupplier(query) {
        let params = new URLSearchParams()
        params.append('name', query)
        supplierList(params).then(res => {
          this.suppliers = res.data.data
        })
      },
      queryClick() {
        this.keyword = this.query
        this.pageNum = 1

        //this.loadOrder()
        this.loadSummary()
      },
      resetClick() {
        this.query.date = []
        this.query.sn = ''
        this.query.supplierId = ''
        this.productName = ''
        this.memberName = ''
        this.supplierName = ''
        this.query.memberId = ''
        this.query.emoloyeeId = ''
        this.pageNum = 1
        this.query.orderSn = ''
        this.query.phone = ''
        this.query.productId = ''
        this.keyword = this.query
        this.loadOrder()
      },
      detailsClick(data) {
    console.log(data);
      if (this.audited==0){
        this.$confirm('确定审核?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          var array=[]
          var params=new URLSearchParams()
          params.append('shopId',data.shopId)
          data.audited=1
          array.push(data)
          audited(array,params).then(res=>{
            if(res.type=='success'){
              this.loadOrder()
            }
          })
        })

      }else{
        this.$router.push({
          path: '/emptyBarrelAudit/summaryList?productId='+data.productId+'&shopId='+data.shopId+'&productName='+this.productName+'&name='+data.name
        })
      }
      },

      beforeUpload(file) {
        const isLt1M = file.size / 1024 / 1024 < 1
        if (isLt1M) {
          return true
        }
        this.$message({
          message: 'Please do not upload files larger than 1m in size.',
          type: 'warning'
        })
        return false
      },
      handleSuccess({ results, header, firstSheetName }) {
        console.log(results)
        console.log(header)
        console.log(firstSheetName)
        this.daoruData = results
        this.firstSheetName = firstSheetName
        this.daoruType = true
      },
      daoruClick() {
        this.$refs.upload.handleUpload()
      },

      daoruClose() {
        this.daoruType = false
      },
      batchShippingClick() {
        var _this = this
        var shippings = []
        _this.daoruData.forEach(function(item) {
          var batchData = {
            productId: item.商品编号,
            sn: item.送货单号,
            trackingNo: item.运单号
          }
          shippings.push(batchData)
        })
        console.log(shippings)
        batchShipping(shippings).then(response => {
          console.log(response)

        }).catch(error => {

        })
      },
      // tabsClick(data) {
      //   var _this = this
      //   console.log(data)
      //   switch (data.paneName) {
      //     case '0':
      //       this.datashow=false
      //        _this.audited=1
      //       _this.shippingStatus = 3 // 配送状态
      //       _this.loadSummary()
      //       // _this.audited=0
      //       // _this.shippingStatus = 2 // 配送状态
      //       // this.loadOrder()
      //       break
      //     case '1':
      //       // _this.audited=1
      //       // _this.shippingStatus = 3 // 配送状态
      //       // _this.loadSummary()
      //       this.datashow=true
      //        _this.audited=0
      //       _this.shippingStatus = 2 // 配送状态
      //       this.loadOrder()

      //       break
      //   }

      // },
      handleCommand(data) {
        console.log(data)
        var _this = this
        if (data == 'import') {
          this.importClick()
        } else if (data == 'shipped') {
          this.sendClick()
        }
      },
      editClick(item){
        console.log(item)
        console.log('修改并审核')
        this.emptyBarrelForm = item
        this.depositClick(4)
      }
    }
  }
</script>

<style scoped>
  .details_card {
    overflow: auto;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
    border: 1px solid #f2f2f2;
    border-radius: 4px;
  }

  .details_card:hover {
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
  }

  .elOption {
    background-color: #909399;
    color: white;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    height: 40px
  }

  .el-input__inner {
    width: 100% !important;
  }

  .app {
    background-color: rgba(248, 248, 248, 0.8);
  }

  /deep/ .el-header {
    padding: 10px;
    /* height: 100% !important; */
    padding-bottom: 0;
  }
  .query_content{
    display: flex;
    align-items: center;
    /*background-color: #0a76a4;*/
    justify-content: center;
  }
  .query_button{

  }
  .report_header {
    width: 100%;
    min-height: 40px;
    box-sizing: border-box;
    background-color: rgba(248, 248, 248, 0.8);
    display: flex;
    padding-bottom: 5px;
    position: relative;
    padding-left: 5px;
    padding-right: 5px;
    flex-direction: column;
  }

  .report_header_left {
    width: 5px;
    height: 46px;
    background-color: #409EFF;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
  }

  .report_header_query {
    margin-left: 10px;
    width: 180px;
    margin-top: 5px;
  }

  .report_header_date {
    margin-left: 10px;
    width: 250px;
    margin-top: 5px;
  }
</style>
